import EchartsMap from "@/components/EchartsMap";
import Title from "@/views/dataAsset/components/Title";
import { FC, memo, useContext } from "react";
import anhuiMapJSON from '@/assets/json/anhui.json'
import { GeoJSONSourceInput } from "echarts/types/src/coord/geo/geoTypes.js";
import { useScreenSchool } from "@/views/dataAsset/helpers/left";
import { EchartsThemeContext } from "@/context/echartsTheme";

const LeftCardTwo: FC = memo(() => {
  const [mapId, echartsOption] = useScreenSchool()
  const { theme } = useContext(EchartsThemeContext)

  return (
    <div className="w-full flex-1 bg-[#fff] rounded-4px flex flex-col">
      <Title name='学校数据采集总量' isUnit={true} />
      <div className="flex-1">
        <EchartsMap theme={theme} options={echartsOption} mapId={mapId} mapData={anhuiMapJSON as GeoJSONSourceInput} />
      </div>
    </div>
  )
})

export default LeftCardTwo